<template>
  <div>
    <!-- 添加素材 -->
    <el-dialog
      v-model="dialogVisible"
      align-center
      title="选择图片素材"
      width="800"
      @close="dialogVisible = false"
    >
      <!-- <BaseTable
        :columns="columns"
        :tableData="tableData"
        ref="baseTableRef"
        :total="pageTotal"
        :rowHeight="rowHeight"
        @changeTable="changeTable"
        :showSearch="showSearch"
      >
        <template v-slot:presignedObjectUrl="{ scope }">
          <image-preview
            :src="scope.presignedObjectUrl"
            :width="50"
            :height="50"
          />
        </template>
      </BaseTable> -->
      <template #footer>
        <div class="dialog-footer">
          <el-button @click="dialogVisible = false">取消</el-button>
          <el-button type="primary" @click="submit"> 确定 </el-button>
        </div>
      </template>
    </el-dialog>
  </div>
</template>
<script setup>
import { getCurrentInstance, ref, watch } from 'vue'
// import { listMaterials } from '@/api/materials'
import { deepClone } from '../../utils'
import { initLayoutData } from '../../config/layoutType'
let dialogVisible = defineModel()
// let props = defineProps({
//   columns: {
//     type: Array,
//     default: () => [],
//   },
//   rowHeight: {
//     type: Number,
//     default: 65,
//   },
//   showSearch: {
//     type: Boolean,
//     default: false,
//   },
//   customParams: {
//     type: Object,
//     default: () => {},
//   },
//   selectCheckBox: {
//     type: Array,
//     default: () => [],
//   },
// })
let { proxy } = getCurrentInstance()
// let { rowHeight, showSearch, customParams, selectCheckBox } = toRefs(props)
let tableData = ref([])
// let pageTotal = ref(0)
let baseTableRef = ref()
let emits = defineEmits(['submit'])
// let changeTable = params => {
//   getList(params)
// }

// watch(
//   () => customParams.value,
//   newVal => {
//     if (newVal) {
//       if (dialogVisible.value == true && baseTableRef.value) {
//         let params = baseTableRef.value.getParams()
//         getList(params)
//       }
//     }
//   },
// )
// let getList = params => {
//   Object.assign(params, customParams.value)
//   // listMaterials(params).then((res) => {
//   //   let { list, total } = res.data
//   //   tableData.value = list
//   //   pageTotal.value = total
//   //   nextTick(() => {
//   //     if (selectCheckBox.value.length) {
//   //       updateCheckboxRow(selectCheckBox.value, true)
//   //     }
//   //   })
//   // })
// }

let submit = () => {
  let rows = baseTableRef.value.getSelectionRows()
  if (rows && rows.length) {
    let list = rows.map(item => {
      let time = initLayoutData.time
      // if (customParams.value.type == 2) {
      //   // 视频
      //   time = item.pubFileLibs[0].sourceDuration
      // }
      let url = null
      // if (customParams.value.type == 0) {
      //   // 文本
      //   url = item.describes
      // } else {
      //   url = item.pubFileLibs[0].materialUrl
      // }
      return {
        title: item.title,
        url,
        id: item.id,
        count: initLayoutData.count,
        time,
      }
    })
    dialogVisible.value = false
    emits('submit', deepClone(list))
  } else {
    proxy.$modal.msgWarning('请选择素材')
  }
}
function updateCheckboxRow(list, type) {
  if (baseTableRef.value) {
    baseTableRef.value.clearCheckboxRow()
  }
  list.forEach(res => {
    tableData.value.forEach(childItem => {
      if (res.id == childItem.id) {
        baseTableRef.value.setCheckboxRow(childItem, type)
      }
    })
  })
}
function setCheckboxRow(res) {
  let row = tableData.value.filter(item => item.id == res.id)
  baseTableRef.value.setCheckboxRow(row, false)
}
function clearCheckboxRow() {
  if (baseTableRef.value) {
    return baseTableRef.value.clearCheckboxRow()
  }
}
defineExpose({
  setCheckboxRow,
  updateCheckboxRow,
  clearCheckboxRow,
})
</script>
